// 这个是一个工具函数，二次封装了axios，就是针对一些请求基地址，超时时间，请求响应拦截器等等的集中配置
// 官网地址  http://www.axios-js.com/zh-cn/docs/#axios-create-config
// npm i axios ======  yarn add axios
import axios from 'axios'
import { Message } from 'element-ui'
import { getStorage } from '@/utils/storage'
import store from '@/store'

// 基于axios在创建一个 实例对象
const request = axios.create({
  baseURL: 'http://interview-api-t.itheima.net',
  timeout: 10000
})

// 在写请求响应拦截器
// 添加请求拦截器 --- 给所有请求头添加token
request.interceptors.request.use(function (config) {
  const token = getStorage() || ''
  if (token) {
    config.headers.Authorization = `Bearer ${token}`
  }
  return config
}, function (error) {
  // 对请求错误做些什么
  return Promise.reject(error)
})

// 添加响应拦截器
request.interceptors.response.use(function (response) {
  // 响应拦截器第一个回调函数是 服务器返回成功  200的时候 执行的函数
  console.log('axios封装服务器返回的值，原始值:', response)
  // 数据脱壳
  return response.data
}, function (error) {
  // 这个函数是 请求报错，服务器返回 4xx 5xx 开头的代码执行的函数
  // 错误提示toast  专门针对401 403 这些错误单独处理
  if (error.response) {
    if (error.response.data.code === 401) {
      // 只要进了这个if，就是token失效，那我们就要执行类似于 退出的操作
      store.dispatch('user/logoutAction')
    } else {
      Message({
        showClose: true,
        message: error.response.data.message || '请求失败',
        type: 'error'
      })
    }
  }
  return Promise.reject(error)
})

export default request
